<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
	<title>test slideshow</title>
	
	<link rel="stylesheet" type="text/css" href="./script/myslide/myslide.css" />
	<link rel="stylesheet" href="http://code.jquery.com/ui/1.8.23/themes/base/jquery-ui.css" type="text/css" media="all" />
	
	<style type="text/css">

/** 
 * Slideshow style rules.
 */

{
	margin:0;
  	padding:0;
  	font:normal 11px Verdana, Geneva, sans-serif;
  	color:#ccc;
}

body {
  background:#cccccc  top left;
}

.slide h2, .slide p {
  margin:15px;
}
.slide h2 {
  font:italic 24px Georgia, "Times New Roman", Times, serif;
  color:#ccc;
  letter-spacing:-1px;
}
.slide img {
  float:right;
  margin:0 15px;
}

</style>
	
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
	<script src="http://code.jquery.com/ui/1.8.23/jquery-ui.min.js" type="text/javascript"></script>
	<script type="text/javascript" src="./script/myslide/myslide.js"></script>

	<script>
	$(document).ready(function(){
		
		var myslideshow=$('#myslideshow').myslide({
						'view-mode':VIEW_MODE_DIALOG,
						'navbar-pos':'top',
						'button-num':3,
						'button-imgs':['./images/test/test1.jpg',
						               './images/test/test2.jpg',
						               './images/test/test3.jpg'],
						'button-funcs':[f1,f2,f3],
						onclose:function(){},
					});
		
		
		/*
		$('#myslideshow').myslide({
			'view-mode':VIEW_MODE_BOOK_DIALOG,
			'mask-opacity':0.5,
			'button-num':3,
			'button-imgs':['./images/test/test1.jpg',
			               './images/test/test2.jpg',
			               './images/test/test3.jpg'],
			'button-funcs':[f1,f2,f3],
			onclose:function(){
				//do something
			}
		});
		*/
		
		function f1(){
			alert(myslideshow.get_current_slide_info());
		}
		
		function f2(){
			alert('f2 is calling');
		}
		
		function f3(){
			alert('f3 is calling');
		}
	});
	
	
	</script>
	
</head>
<body>
<div>
	<h3>Testing</h3><br>
	<p>this is just for showing that it will be blinded by the blinder</p>
</div>

	<div id="myslideshow">
    <div id="myslide_container">
    
      	<div class="slide" bg="./images/test/test1.jpg" ch-idx='0' h-idx="0" v-idx="0">
	        	<h2>Web Development Tutorial</h2>
	        	<p><a href="http://sixrevisions.com/tutorials/web-development-tutorials/using-xampp-for-local-wordpress-theme-development/"><img src="./images/test/test1.jpg" alt="An image that says Install X A M P P for wordpress." width="215" height="145" /></a>If you're into developing web apps, you should check out the tutorial called "<a href="http://sixrevisions.com/tutorials/web-development-tutorials/using-xampp-for-local-wordpress-theme-development/">Using XAMPP for Local WordPress Theme Development</a>" which shows you how to set up a local testing server for developing PHP/Perl based applications locally on your computer. The example also shows you how to set up WordPress locally!</p>
     	</div>
		
		<div class="slide" bg="./images/test/test2.jpg" ch-idx='0' h-idx='0' v-idx='1'>
			
				<h2>Grunge Brushes, Anyone?</h2>
				<p><a href="http://sixrevisions.com/freebies/brushes/sr-grunge-free-high-resolution-photoshop-grunge-brushes/"><img src="./images/test/test2.jpg" width="215" height="145" alt="A thumbnail image that says S R grunge photoshop brushes 6 high resolution grunge brushes by six revisions." /></a>In this layout, I used <a href="http://sixrevisions.com/freebies/brushes/sr-grunge-free-high-resolution-photoshop-grunge-brushes/">SR Grunge</a>, which is a free set of high-resolution Photoshop brushes you can download here on Six Revisions.</p>
	        	<p></p>
	        
		</div>
		
		<div class="slide" bg="./images/test/test3.jpg" ch-idx='0' h-idx='0' v-idx='2'>
        		<h2>How About Some Awesome Grunge Textures?</h2>
        		<p><a href="http://sixrevisions.com/freebies/textures/grunge-extreme-15-high-resolution-grunge-textures/"><img src="./images/test/test3.jpg" width="215" height="145" alt="A thumbnail image that says grunge extreme 15 free high resolution grunge textures six revisions." /></a>The texture used in this web page is from the Grunge Extreme Textures freebie set by JC Parmley released here on Six Revisions.</p>
        		<p>You can head over to the <a href="http://sixrevisions.com/freebies/textures/grunge-extreme-15-high-resolution-grunge-textures/">Grunge Extreme</a> page to download the texture set or check out Six Revisions' <a href="http://sixrevisions.com/category/freebies/">freebie section</a> for even more goodies!</p>
		</div>
		
		<div class="slide" bg="./images/test/test4.jpg" ch-idx='4' h-idx='0' v-idx='0'>
				<h2>'Tis the End, My Friend.</h2>
				<p><a href="http://sixrevisions.com/tutorials/photoshop-tutorials/how-to-create-a-slick-and-clean-button-in-photoshop/"><img src="./images/test/test4.jpg" width="215" height="145" alt="Thumbnail image that says sleek button using photoshop that links to a Photoshop tutoril." /></a>This is the last slide. Hit the left arrow control to go back to the other slides.</p>
				<p>Alternatively, you may want to check out the tutorial on how to create a simple and cool button in Photoshop called &quot;<a href="http://sixrevisions.com/tutorials/photoshop-tutorials/how-to-create-a-slick-and-clean-button-in-photoshop/">How to Create a Slick and Clean Button in Photoshop</a>&quot; which was inspired by the <a href="http://www.campaignmonitor.com/designer/?utm_source=sixrevisions&amp;utm_medium=banner&amp;utm_term=2&amp;utm_content=0003&amp;utm_campaign=Apr09Banners">Campaign Monitor</a> web interface.</p>
		</div>

		<div class="slide" bg="./images/test/test5.jpg" ch-idx='4' h-idx='1' v-idx='0'>
				<h2>'Tis the End, My Friend.</h2>
				<p><a href="http://sixrevisions.com/tutorials/photoshop-tutorials/how-to-create-a-slick-and-clean-button-in-photoshop/"><img src="./images/test/test5.jpg" width="215" height="145" alt="Thumbnail image that says sleek button using photoshop that links to a Photoshop tutoril." /></a>This is the last slide. Hit the left arrow control to go back to the other slides.</p>
				<p>Alternatively, you may want to check out the tutorial on how to create a simple and cool button in Photoshop called &quot;<a href="http://sixrevisions.com/tutorials/photoshop-tutorials/how-to-create-a-slick-and-clean-button-in-photoshop/">How to Create a Slick and Clean Button in Photoshop</a>&quot; which was inspired by the <a href="http://www.campaignmonitor.com/designer/?utm_source=sixrevisions&amp;utm_medium=banner&amp;utm_term=2&amp;utm_content=0003&amp;utm_campaign=Apr09Banners">Campaign Monitor</a> web interface.</p>
		</div>

		<div class="slide" bg="./images/test/test6.jpg" ch-idx='1' h-idx='0' v-idx='0'>
				<h2>'Tis the End, My Friend.</h2>
				<p><a href="http://sixrevisions.com/tutorials/photoshop-tutorials/how-to-create-a-slick-and-clean-button-in-photoshop/"><img src="./images/test/test6.jpg" width="215" height="145" alt="Thumbnail image that says sleek button using photoshop that links to a Photoshop tutoril." /></a>This is the last slide. Hit the left arrow control to go back to the other slides.</p>
				<p>Alternatively, you may want to check out the tutorial on how to create a simple and cool button in Photoshop called &quot;<a href="http://sixrevisions.com/tutorials/photoshop-tutorials/how-to-create-a-slick-and-clean-button-in-photoshop/">How to Create a Slick and Clean Button in Photoshop</a>&quot; which was inspired by the <a href="http://www.campaignmonitor.com/designer/?utm_source=sixrevisions&amp;utm_medium=banner&amp;utm_term=2&amp;utm_content=0003&amp;utm_campaign=Apr09Banners">Campaign Monitor</a> web interface.</p>
		</div>

		<div class="slide" bg="./images/test/test8.jpg" ch-idx='1' h-idx='0' v-idx='1'>
				<h2>'Tis the End, My Friend.</h2>
				<p><a href="http://sixrevisions.com/tutorials/photoshop-tutorials/how-to-create-a-slick-and-clean-button-in-photoshop/"><img src="./images/test/test8.jpg" width="215" height="145" alt="Thumbnail image that says sleek button using photoshop that links to a Photoshop tutoril." /></a>This is the last slide. Hit the left arrow control to go back to the other slides.</p>
				<p>Alternatively, you may want to check out the tutorial on how to create a simple and cool button in Photoshop called &quot;<a href="http://sixrevisions.com/tutorials/photoshop-tutorials/how-to-create-a-slick-and-clean-button-in-photoshop/">How to Create a Slick and Clean Button in Photoshop</a>&quot; which was inspired by the <a href="http://www.campaignmonitor.com/designer/?utm_source=sixrevisions&amp;utm_medium=banner&amp;utm_term=2&amp;utm_content=0003&amp;utm_campaign=Apr09Banners">Campaign Monitor</a> web interface.</p>
		</div>
    
	</div>
	</div>

</body>
</html>